<template>
  <el-card class="chart-card">
    <div slot="header" class="chart-header">{{ title }}</div>
    <div class="chart-content">
      <slot></slot>
    </div>
  </el-card>
</template>

<script>
export default {
  name: 'ChartCard',
  props: {
    title: {
      type: String,
      required: true
    }
  }
};
</script>

<style scoped>
.chart-header {
  font-size: 16px;
  font-weight: bold;
}
.chart-content {
  height: 300px;
}
</style>
